<template>
  <div>
    <el-drawer
      ref="drawer"
      :title="title"
      destroy-on-close
      :visible.sync="drawer"
      direction="rtl"
      :append-to-body="true"
      :before-close="handleClose">
      <component :is="node?node.type:''" v-model="form" >
        <template v-slot:[key]="data" v-for="(item, key) in $scopedSlots">
          <slot :name="key" v-bind="data || {}"></slot>
        </template>
      </component>
    </el-drawer>
  </div>
</template>

<script>
import Between from './between'
import Skip from './skip'
// import SnakerCustom from './custom'
// import SnakerDecision from './decision'
// import SnakerTask from './task'
// import SnakerTransition from './transition'
// import SnakerProcess from './process'
// import SnakerJoin from './join'
// import SnakerFork from './fork'
// import SnakerSubProcess from './subProcess'
// import SnakerWfSubProcess from './wfSubProcess'

export default {
  components: {
    Between,
    Skip,
    // SnakerCustom,
    // SnakerDecision,
    // SnakerTask,
    // SnakerTransition,
    // SnakerProcess,
    // SnakerJoin,
    // SnakerFork,
    // SnakerSubProcess,
    // SnakerWfSubProcess
  },
  props: {
    value: {
      type: Object,
      default () {
        return {}
      }
    },
    node: {
      type: Object,
      default () {
        return {}
      }
    },
    lf: {
      type: Object,
      default () {
        return null
      }
    },
  },
  data () {
    return {
      drawer: false,
      form: {},
      nodeId: undefined
    }
  },
  computed: {
    title () {
      if (this.node && this.node.type === 'skip') {
        return '设置边属性'
      }
      return '设置节点属性'
    }
  },
  methods: {
    show () {
      this.drawer = true
    },
    handleClose () {
      this.drawer = false
    }
  }
}
</script>

<style scoped>
.el-drawer__container ::-webkit-scrollbar {
  display: none;
}
</style>
